<template>
	<view class="container">
		<block v-if="tdList.length > 0">
			<scroll-view  scroll-x class="sv" show-scrollbar="true">
				<view class="table">
					<u-table align="left">
						<u-tr v-for="(item,index) in tdList" :key="index">
							<u-td class="table_one" :style="{backgroundColor: (index % 2 != 0 ? '#f5f6f8' :'')}">
								<view class="td-on">
									<u-form>
										<u-form-item label="ID" label-width="160">
											<u-input disabled v-model="item.id" />
										</u-form-item>
										<u-form-item label="用户名" label-width="160">
											<u-input disabled v-model="item.nickname" />
										</u-form-item>
										<u-form-item label="标题" label-width="160">
											<u-input disabled v-model="item.title" />
										</u-form-item>
										<u-form-item label="创建时间" label-width="160">
											<view class="td-item">
												{{timeFormats(item.create_time)}}
											</view>
										</u-form-item>
										<u-form-item label="操作" label-width="160" :border-bottom="false">
											<view class="td-item">
												<u-button type="primary" size="mini" @click="look(item.id)">详情</u-button>
											</view>
										</u-form-item>
									</u-form>
								</view>
							</u-td>
						</u-tr>
					</u-table>
				</view>
			</scroll-view>
			<u-loadmore :status="has_more ? status : 'nomore'" />
		</block>
		<u-empty v-else text="暂无数据"  margin-top="100" mode="list"></u-empty>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				thList: [{name:'ID',id:'id'},{name:'用户名',id:'nickname'},{name:'标题',id:'title'},{name:'创建时间',id:'create_time'},{name:'操作',id:''}],
				tdList: [],
				customer_id: '',
				status: 'loadmore',
				pages: 0,
				pageSize: 10,
				has_more: false
			};
		},
		onLoad(e) {
			this.customer_id = e.customer_id
			this.getGroupdata()
		},
		onUnload() {
			
		},
		onShow(){
			
		},
		methods: {
			// 格式化时间
			timeFormats(val) {
				if(val) {
					return this.$u.timeFormat(val, 'yyyy/mm/dd hh:MM');
				} else {
					return '--'
				}
			},
			// 获取数据
			getGroupdata(){
				this.$u.api.onLookOperatelog({
					customer_id: this.customer_id,
					offset: (this.pages || 0 ) * this.pageSize,
					limit: this.pageSize,
				}).then(res => {
					if(res.code == 1 ) {
						this.tdList = [...this.tdList, ...res.data.rows];
						this.has_more = this.tdList.length < res.data.total
						// console.log(this.tdList)
					}
				})
			},
			// 查看
			look(val){
				this.$u.route('/pagesA/checkLog/logDetails',{
					id:val
				})
			}
		},
		onReachBottom() {
			if (this.has_more) {
				this.status = 'loading';
				this.pages++;
				this.getGroupdata();
			}
		}
	}
</script>

<style lang="scss">
.container {
	padding-bottom: 50px;
}
.tap {
	justify-content: space-between;
  padding: 10rpx 20rpx;
}
.table {
	// min-width: 460px;
	padding: 30rpx 15rpx;
}
.table_one {
	border-top: 0;
	border-left: 0;
	position: relative;
}
.td-on {
	padding: 0rpx 25rpx;
}
.td-item {
	// color: #2979ff;
	.su {
		color: #19be6b
	}
	.err {
		color: #fa3534
	}
}

/deep/ .u-form-item {
	padding: 10rpx 0 !important;
}


</style>
